<template>
  <div>
    <button v-for="i in list.arr" :key="i" @click="delById(i)">
      点击删除{{ i }}
    </button>
    <Dialog :flag="flag" @cancel="cancel" @determine="determine"></Dialog>
  </div>
</template>

<script setup>
import Dialog from "@/components/Dialog1.vue";
import { ref, reactive } from "vue";
let list = reactive({
  arr: [1, 2, 3, 4, 5],
});
let id = ref(0);
let flag = ref(false);
let delById = (i) => {
  id.value = i;
  flag.value = true;
};
const cancel = () => {
  console.log("取消");
  flag.value = false;
};
const determine = () => {
  console.log("删除", id.value);
  list.arr = list.arr.filter((item) => item != id.value);
  flag.value = false;
};
</script>

<style></style>
